<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <title>Tuyển Dụng</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">       
        <link type="text/css" rel="stylesheet" href="css/bootstrap.css" media="all">   
        <link type="text/css" rel="stylesheet" href="css/font-awesome.css" media="all">
        <link type="text/css" rel="stylesheet" href="css/paschino.css" media="all"> 
            <style type="text/css">
                              #googleMap img {
                                max-width: none;
                            }
                            #googleMap1 img {
                                max-width: none;
                            }
                        </style>
<!--                                  <script
                            src="http://maps.googleapis.com/maps/api/js?key=AIzaSyB2B5G7gCFIt2esXfmbGf_Ds3ksPNP0cgM&sensor=false">
                        </script> -->
                                              <script
                            src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDT-M6jMmDSwfsUqD2VRf2IO6FiimpLi_g&sensor=false">
                        </script>  
                              <script>
                            var myCenter1 = new google.maps.LatLng(10.826736,106.67975);

                            function initialize1() {
                                var mapProp = {
                                    center: myCenter1,
                                    zoom: 17,
                                    mapTypeId: google.maps.MapTypeId.ROADMAP
                                };

                                var map = new google.maps.Map(document.getElementById("googleMap1"), mapProp);

                                var marker = new google.maps.Marker({
                                    position: myCenter1,
                                });

                                marker.setMap(map);
                            }

                            google.maps.event.addDomListener(window, 'load', initialize1);


                        </script>
                          <script>
                            var myCenter = new google.maps.LatLng(10.813913, 106.666069);

                            function initialize() {
                                var mapProp = {
                                    center: myCenter,
                                    zoom: 17,
                                    mapTypeId: google.maps.MapTypeId.ROADMAP
                                };

                                var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);

                                var marker = new google.maps.Marker({
                                    position: myCenter,
                                });

                                marker.setMap(map);
                            }

                            google.maps.event.addDomListener(window, 'load', initialize);


                        </script>
    </head>
    <body >

        <div class="container" style="background-image: url('img/body_background.jpg'); padding-bottom: 70px">
            <div class="offset4" >
                <div class="nav" style="margin-right: 40px"> 
                    <div class="menu" >
                        <a class="submenu" href="#">
                            <div class="greenmenu" >
                                <div class=" menutitle ">
                                    Trang chủ 
                                </div>
                            </div>

                        </a>
                    </div>
                    <div class="menu">
                        <a class="submenu" href="#">
                            <div class="orangemenu " >
                                <div class="menutitle"  >
                                    Giới thiệu
                                </div>
                            </div>

                        </a> 
                    </div>
                    <div class="menu">
                        <a class="submenu" href="#">
                            <div class="purplemenu" >
                                <div class="menutitle"  >
                                    Menu
                                </div>
                            </div>

                        </a> 
                    </div>
                    <div class="menu">
                        <a class="submenu" href="#">
                            <div class="greenmenu" >
                                <div class="menutitle"  >
                                    Tin tức 
                                </div>
                            </div>

                        </a>
                    </div>
                    <div class="menu">
                        <a class="submenu" href="#">
                            <div class="orangemenu" >
                                <div class="menutitle"  >
                                    Thư viện
                                </div>
                            </div>

                        </a> 
                    </div>
                    <div class="menu">
                        <a class="submenu" href="#">
                            <div class="purplemenu " >
                                <div class="menutitle"  >
                                    Tuyển dụng 
                                </div>
                            </div>

                        </a>
                    </div>
                    <div class="menu">
                        <a class="submenu" href="#">
                            <div class="greenmenu greenmenuactive" >
                                <div class="menutitle"  >
                                    Liên hệ
                                </div>
                            </div>

                        </a> 
                    </div>
                </div>
            </div>


            <div class="item">

                <img class="logopaschino" src="img/logo_paschino.png">

            </div>


            <div class="row-fluid" style="min-height: 650px; max-height: 2000px">

                <div class="span11" style="background-color: white !important; margin-left: 48px; margin-top: 50px; padding-bottom: 20px" >
                    <div class="controls" >
                        <div class="row-fluid" style="height: 50px; background-color: #5EC4B6">
                            <!--<label style="font-size: 30px; line-height: 50px; margin-left: 30px; color: white">Tuyển Dụng</label>-->

                        </div>
                        <div class="row-fluid" style="margin-top: 30px">
                           
                            <div class="span12">
                                <div class="span7" style="min-height: 530px; max-height: 530px; overflow: hidden; "> 
                                <div class="span7" id="hongha" style="display: block; margin-left: 20px">
                           
                      
                        <div id="googleMap" style="height: 500px; width: 500px;  margin-top: 20px">

                        </div>

                    

                                </div>
                        <div class="span7" id="vanlang" style="display: block; margin-left: 20px">
                           
                 
                        <div id="googleMap1" style="height: 500px; width: 500px;  margin-top: 20px">

                        </div>

                    

                                </div>
                                </div>
                                <div class="span5" style="margin-left: 5px; margin-top: 10px">
                                    <div class="controls-row" style="margin-top: 20px">
                                        <label style="line-height: 26px; font-size: 26px; color: #F58345" onclick="clickHongHa();">Chi Nhánh Tân Sơn Nhất</label>
                                        <label>1A Hồng Hà, P.2, Q.Tân Bình, Tp Hồ Chí Minh</label>
                                        <label><i class="icon-phone"></i> : 08 3 930 4040 &nbsp; -  &nbsp;&nbsp;<i class="icon-envelope"></i> : admin@paschinocoffee.com</label>
                                    </div> 
                                      <div class="controls-row" style="margin-top: 20px">
                                          <label style="line-height: 26px; font-size: 26px; color: #F58345" onclick="clickVanLang();">Chi Nhánh Văn Lang</label>
                                        <label>2 Quang Trung, P.2, Q.Gò Vấp, Tp Hồ Chí Minh</label>
                                        <label><i class="icon-phone"></i> : 08 3 930 4040 &nbsp; -  &nbsp;&nbsp;<i class="icon-envelope"></i> : admin@paschinocoffee.com</label>
                                    </div> 
                                </div>

                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script type="text/javascript" src="js/jquery.js"></script>
        <script type="text/javascript" src="js/bootstrap.js"></script>
        <script type="text/javascript">
            $('.carousel').carousel({
                interval: 5000
            })
        </script>
        <script type="text/javascript">
            var hongha = document.getElementById("hongha");
            var vanlang = document.getElementById("vanlang");
            function clickHongHa(){
                hongha.style.display = "block";
            
                vanlang.style.display = "none";
//                 hongha.createAttribute();
            }
            function clickVanLang(){
                 hongha.style.display = "none";
                  
                vanlang.style.display = "block";
//                hongha.removeAttribute();
            }
        </script>
        <script type="text/javascript">
            $(document).ready(function() {
                $('.viewport').mouseenter(function(e) {
                    $(this).children('a').children('img').animate({height: '220', left: '0', top: '0', width: '265'}, 100);
                    $(this).children('a').children('span').fadeIn(200);

                }).mouseleave(function(e) {
                    $(this).children('a').children('img').animate({height: '220', left: '0', top: '0', width: '265'}, 100);
                    $(this).children('a').children('span').fadeOut(200);
                });
            });
        </script>
        <footer>
            <div class="container" >
                <div class="pull-left offset1" style="width: 400px; position: absolute; color: white; margin-top: 50px">
                    <label style="font-weight: bold">Địa Chỉ:</label>
                    <label>1A Hồng Hà, P.2, Q.Tân Bình, Tp.Hồ Chí Minh</label>
                    <label>Điện thoại: 0839304040</label>
                    <label>Email: admin@paschinocoffee.com</label>
                </div>
                <div class="imagefooter">
                    <img src="img/DELIVERY.png">
                </div>
                <div class="row-fluid" style="height: 200px">
                    <img style="max-height: 200px; min-height: 200px; width: 1024px" src='img/footer_purple.png'>
                </div>
                <div class="row-fluid" style="padding-top: 10px;">
                    <img style="height: 50px; width: 100%" src='img/footer.png'>
                </div>
            </div>  

        </footer>
    </body>


</html>
